導讀:什么是彩色字體?這是一個(gè)不斷彈出并開(kāi)始獲得認可的術(shù)語(yǔ),盡管在大型設計項目中的使用的很少。像Adobe Typekit這樣的供應商已經(jīng)開(kāi)始發(fā)布一些支持瀏覽器的彩色字體,當然也有一些
發(fā)表日期:2020-02-05
文章編輯:興田科技
瀏覽次數:9191
標簽:
什么是彩色字體?這是一個(gè)不斷彈出并開(kāi)始獲得認可的術(shù)語(yǔ),盡管在大型設計項目中的使用的很少。
像Adobe Typekit這樣的供應商已經(jīng)開(kāi)始發(fā)布一些支持瀏覽器的彩色字體,當然也有一些更廣泛的用途。有些人甚至稱(chēng)彩色字體為“網(wǎng)頁(yè)設計中的下一件大事”。接下來(lái),我們來(lái)看看這一趨勢,你來(lái)決定它是否是一件大事。
什么是彩色字體?
1、彩色字體幾乎就像它聽(tīng)上去那樣,包含多種顏色,陰影或漸變,紋理或透明度的字體。它不僅僅是給字體添加了顏色,是包含很多細節的特定字體。
彩色字體可以是字體文件中的矢量形狀、位圖圖像或是兩者結合,這就使得彩色字體比標準字體包更大。常見(jiàn)示例包括表情符號或含有圖標的字體。
彩色字體的大問(wèn)題是現在沒(méi)有真正的標準格式。有一個(gè)缺陷就是所有的字體文件格式中矢量和SVG圖像可以縮放自如,但位圖可能會(huì )有大小限制。
實(shí)際上有五種格式要處理:
SBIX(Apple):在Mac和iOS系統上的原生位圖版本
CBDT(Google):在A(yíng)ndroid系統上的原生位圖版本
COLR(Microsoft):在Windows 8.1+系統上的原生矢量圖版本
SVG(W3C):矢量和位圖版本
OpenType SVG(Adobe/Mozilla):將SVG形狀放在OpenType字體中的矢量和位圖版本
Mozilla(火狐瀏覽器的骨干)和Adobe已經(jīng)同意OpenType SVG是選格式;其他人還在不斷的改變著(zhù)決定。
如果你想了解這些字體的工作原理以及所有文件格式的明確說(shuō)明,可以查看Fontself(https://learn.fontself.com/color-fonts-what-when-where-dd8c82e5a561),它有一個(gè)很好的入門(mén)說(shuō)明。
如何使用顏色字體?
2、當你次看到彩色字體時(shí),可能會(huì )產(chǎn)生的想法:
哇,太可惡了!
cool!我知道如何使用它!
無(wú)論你感受如何,一定有非常適合彩色字體的應用程序,但你需要理性地使用它們。(少量使用彩色字體。)
可以使用彩色字體:
用一個(gè)短詞語(yǔ)引人注意的技巧
用于圖標或logo的元素
用于一段長(cháng)文本的段大字
用于小型設計中醒目的標題
將焦點(diǎn)聚集在一個(gè)特定的詞語(yǔ)上或是一大段文字中的某個(gè)詞語(yǔ)
當其余的設計比較簡(jiǎn)單
作為排版中你主要的設計元素
當項目需要一些有趣和不尋常的東西來(lái)吸引用戶(hù)的注意
不使用彩色字體
3、更多時(shí)候我們不使用顏色字體。你一定不想把網(wǎng)站設計成20世紀90年代那種閃爍的色彩瘋狂的風(fēng)格。
不要使用彩色字體:
有圖片或在圖片上方
復雜的背景
很多文字
有很多其他的設計技巧,如動(dòng)畫(huà);單色通常足以產(chǎn)生視覺(jué)沖擊
有其他新奇或特殊的字體
不斷發(fā)展的趨勢
4、彩色字體開(kāi)始流行是因為它在排版中起到了重要的作用而獲得認可。Adobe和Mozilla采用的OpenType SVG格式可能是幫助這一趨勢真正流行的工具,Adobe近甚至向photoshop中添加了彩色字體(你可能已經(jīng)注意到字符調色板中有一些emojis)。
這里是關(guān)于A(yíng)dobe如何解釋的OpenType SVG:(https://helpx.adobe.com/typekit/using/ot-svg-color-fonts.html)
“OpenType-SVG是一種字體格式,OpenType字體具有作為SVG(可縮放矢量圖形)圖形的全部或部分的代表符號,這允許在單個(gè)字形中顯示多種顏色或漸變。由于這些特性,我們經(jīng)常將OpenType-SVG字體稱(chēng)為“彩色字體”。
“OpenType-SVG字體允許以這些圖形的性質(zhì)顯示文本,同時(shí)允許被編輯、索引或搜索。它們包含OpenType的功能,允許字形替換或替代字形樣式。
“彩色字體的出現和Trajan Color Concept和Emoji One Color一樣,就像你程序字體菜單中的特有字體。但是,由于許多程序尚未完全支持顏色組件,因此無(wú)法顯示其全部可能性。如果你的軟件程序不支持字體中的SVG圖形,則字形將恢復為純黑色樣式。顏色仍然可以應用于這種后備樣式,因為它如同典型的OpenType字體一樣?!?/p>
此外,The State of Web Type(http://stateofwebtype.com/#Color%20fonts)有一個(gè)部分專(zhuān)門(mén)用于更新瀏覽器來(lái)支持彩色字體,因此你可以確定何時(shí)適合使用。
在彩色字體的演變和使用方面,兩件事將發(fā)揮主要作用:
Web設計項目的選擇以及瀏覽器的兼容性(由于兼容性問(wèn)題,實(shí)際上彩色字體設計更多的出現在打印中)。
現有的風(fēng)格技術(shù)是否可以與華麗多彩的設計技術(shù)統一。
嘗試顏色字體
5、如果彩色字體是你想要的設計,你可以下載來(lái)使用或自己創(chuàng )建,具體取決于設計項目的類(lèi)型。
自己創(chuàng )建
你的軟件技能將決定你創(chuàng )建彩色字體的類(lèi)型。你可以自己完成或使用工具來(lái)幫助設計你想要的彩色字體。
Fontself(https://www.fontself.com/)是ai和ps可以添加的插件,它能幫助你創(chuàng )建彩色字體
你可以學(xué)習Glyphs(https://glyphsapp.com/tutorials/creating-a-layered-color-font)的教程,從頭開(kāi)始繪制設計
FontLab(https://www.youtube.com/watch?v=Yit1ZpClwAk)有視頻教程,逐步的講解整個(gè)過(guò)程。
下載或嵌入
這里有一些可以幫助你創(chuàng )建彩色字體:
用傲慢的類(lèi)型(https://www.typewithpride.com/)
沙灘巾(https://creativemarket.com/anugrahadesign/1512983-Beach-Towel-Color-Font)
蹦極(https://djr.com/bungee/)
水彩字體(https://creativemarket.com/undrey/1240261-Watercolor-font)
Bixa顏色(https://bixacolor.com/)
兒童玩具(https://creativemarket.com/popskraft/1409713-Colorful-typefaces-child-typography)
一線(xiàn)大膽(https://creativemarket.com/kaer_cm/1219084-OneLine-Bold-color-font)
領(lǐng)袖(http://www.novotypo.nl/fonts/guru.html)
氖(https://creativemarket.com/inkdrop/1274409-Neon-OTF-colour-font)
更多新聞
2020
2016年將是整個(gè)奢侈品行業(yè)進(jìn)一步結構化調整的一年,品牌多極化趨勢將進(jìn)一步呈現,而消費者也將獲得前所未有的尊重和重視。財富品質(zhì)研究院日前公布《2015奢侈品報告》并做出以下
View details
2023
簡(jiǎn)介在當今數字化時(shí)代,擁有一個(gè)專(zhuān)業(yè)的網(wǎng)站建設方案書(shū)對于企業(yè)的成功至關(guān)重要。。一個(gè)有效的網(wǎng)站建設方案書(shū)...
View details
2023
為什么需要網(wǎng)站建設?在數字化時(shí)代,互聯(lián)網(wǎng)已經(jīng)成為商業(yè)發(fā)展的重要驅動(dòng)力。。擁有一個(gè)精心設計和優(yōu)化的網(wǎng)站...
View details
2023
在當今數字化的時(shí)代,網(wǎng)站已經(jīng)成為企業(yè)推廣和宣傳的重要工具之一。。防城港作為一個(gè)發(fā)展迅速的城市,網(wǎng)站制...
View details